Example of the youtube-embed pane on imcdgroup.com

Drupal 7: Writing a custom contenttype pane (Youtube-embed).

(this is a copy of the article I wrote at: vdmi.nl)
In this little 'how-to' we will build a youtube-embed contentpane with some basic configuration options. Although working with panels and panelizer is not common practice for everyone, this tutorial asumes you know what they are and how to use them (at least a little bit, like myself :-) ). If you don't, look here and read this


We'll start off with a regular custom module to serve our 'plugins'. 'MYMODULE_plugins'. Since we are writing ctools / panels plugins, ctools and panels are required and therefor we need to set them as a dependency, so the .info looks something like this:

1
2
3
4
5
6
name =  MYMODULE_plugins
description = Custom contenttype panes
core = 7.x
package = Custom
dependencies[\\] = ctools
dependencies[\\] = panels
In order to keep things organised we will create a directory inside our module folder called 'plugins'. Inside it lets also create a directory called 'contentypes', since that's what we're making. This folder will contain our plugin files (the files where the actual plugin functionality is defined). The .module file is very basic. The only thing we need to do is tell ctools where to look for our plugin files. Ctools gives us a hook for this: hook_ctools_plugin_directory(); So the .module file looks something like this:
1
2
3
4
5
6
7
8
9
/**
 * Implements hook_ctools_plugin_directory().
**/
 
function MYMODULE_plugins_ctools_plugin_directory($owner, $plugin_type) {
  if ($owner == 'ctools' && $plugin_type == 'content_types') {
    return 'plugins/' . $plugin_type;
  }
}

Next, in the above defined directory, we'll create our plugin file. PLUGIN_NAME.inc In this tutorial we want to embed a youtube video, so we'll name our file: youtube_embed.inc

What we'll need , in short, for this plugin to work is:

  • a plugin definition; an array with settings.
  • an edit form.
  • a submit handler; a form_state processor.
  • a view (render); the html content.
  • some administrators information; title and description.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
/**
 * Plugins are described by creating a $plugin array which will be used
 * by the system that includes this file.
 */
$plugin = array(
  'title' => t('Youtube embed'),
  'description' => t('Shows a youtube video.'),
  'category' => t('Custom'),
  'edit form' => 'youtube_embed_edit_form',
  'render callback' => 'youtube_embed_render',
  'admin info' => 'youtube_embed_admin_info',
  'defaults' => array(
      'description' => t('some working tunes.. '),
      'youtube_url' => 'http://www.youtube.com/watch?v=bTMZDr9RGBo',
    )
);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
/**
 * 'Edit form' callback for the content type.
 */
function youtube_embed_edit_form($form, &$form_state) {
  $conf = $form_state['conf'];
 
  $form['description'] = array(
    '#title' => t('Description'),
    '#description' => t('Description (administrative)'),
    '#type' => 'textfield',
    '#required' => FALSE,
    '#default_value' => $conf['description'],
  );
 
  $form['youtube_url'] = array(
    '#title' => t('Youtube url'),
    '#description' => t('The url of the youtube video you want to show'),
    '#type' => 'textfield',
    '#required' => TRUE,
    '#default_value' => $conf['youtube_url'],
  );
 
  return $form;
}
 
/**
 * The submit form stores the data in $conf.
 */
function youtube_embed_edit_form_submit($form, &$form_state) {
  foreach (array_keys($form_state['plugin']['defaults']) as $key) {
    if (isset($form_state['values'][$key])) {
      $form_state['conf'][$key] = $form_state['values'][$key];
    }
  }
}
 
/**
* implements
**/
 
function youtube_embed_render($subtype, $conf, $panel_args) {
 
  $url = (!empty($conf['youtube_url'])) ? check_plain($conf['youtube_url']) : '';
  $description = (!empty($conf['description'])) ? check_plain($conf['description']) : '';
  $title = 'Youtube: ('.$description.')';
 
  $output = '<iframe src="'.$url.'"></iframe>';//lalala
 
  $block = new stdClass();
  $block->module = 'youtube_embed';
  $block->delta = $sub_type;
  $block->title = $title;
  $block->content = $output;
 
  return $block;
}
With only a little bit of extra effort we can add some descriptive information for site-administrators. This gives quick info on what the settings are of our particular pane-instance.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
/**
* add some info to the administrators view.
**/
function youtube_embed_admin_info($subtype, $conf, $context = NULL) {
 
  $block = youtube_embed_render($subtype, $conf, array('youtube') );
  $block->content = t('<strong>Showing:</strong><br> @description <br>@youtube_url', array(
      '@description' => $conf['description'],
      '@youtube_url' => $conf['youtube_url'],
    ));
  return $block;
}
 
function youtube_embed_admin_title($subtype, $conf, $context = NULL) {
  $output = t('Youtube embed');
  if ($conf['override_title'] && !empty($conf['override_title_text'])) {
    $output = filter_xss_admin($conf['override_title_text']);
  }
  return $output;
}
That's it! This should work nicely. Hopefully this is usefull to someone.